<%--
    Document   : index
    Created on : Nov 23, 2009, 11:40:13 PM
    Author     : fdcube
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <script type="text/javascript" src="ext/ext-base.js"></script>
        <script type="text/javascript" src="ext/ext-all-debug.js"></script>
        <script type="text/javascript" src="ext/row-editor.js"></script>
        <link href="ext/ext-all.css" rel="stylesheet" type="text/css" />
        <link href="ext/xtheme-gray.css" rel="stylesheet" type="text/css" />
        <title>客户管理系统</title>
    </head>
    <body>
        <div>
            <span style="float:left; margin:20px 10px 0px 20px" id="grid"></span>
        </div>
        <script type="text/javascript">
            Ext.Ajax.request(
            {
                url: 'cus/list.action',
                success: function(response, options) {
                    var jsonData = Ext.util.JSON.decode(response.responseText);
                    var reader=new Ext.data.JsonReader(
                    {
                        root:'jsonArray'
                    },
                    [
                        {name:'cid'},
                        {name: 'cname'},
                        {name:'cmail'},
                        {name:'cphone'},
                        {name:'cbirthday'},
                        {name:'event',mapping:'cusevents[0]'}
                    ]
                )
                    var store=new Ext.data.Store({
                        reader:reader
                    });
                    store.loadData(jsonData);
                


                    var col=new Ext.grid.ColumnModel([
                        {header:'ID',sortable: true,dataIndex:'cid'},
                        {header:'姓名',sortable: true,dataIndex:'cname',editor: Ext.form.Field},
                        {header:'邮箱',sortable: true,dataIndex:'cmail',editor: Ext.form.Field},
                        {header:'电话',sortable: true,dataIndex:'cphone',editor: Ext.form.Field},
                        {header:'生日',sortable: true,dataIndex:'cbirthday',editor: Ext.form.Field},
                        {header:'最新事件',sortable:true,dataIndex:'event',editor: Ext.form.Field}
                    ]);
                    var view=new Ext.grid.GridView(
                    {
                        forceFit:true,
                        sortAscText :'正序',
                        sortDescText :'倒序'
                    });
                    view.columnsText='列显示/隐藏';
                    var grid=new Ext.grid.EditorGridPanel({
                        renderTo:Ext.get('grid').dom,
                        store: store,
                        cm: col,
                        width:800,
                        height:300,
                        title:'功能管理',// 标题
                        frame:true
                    });

                    grid.on("afteredit", afterEdit, grid);
                    // 事件处理函数
                    function afterEdit(e) {
                        var record = e.record;// 被编辑的记录
                        // 显示等待对话框
                        Ext.Msg.wait("请等候", "修改中", "操作进行中...");

                        // 更新界面, 来真正删除数据
                        Ext.Msg.alert('您成功修改了用户信息', "被修改的用户是:" + e.record.get("name").value + "\n 修改的字段是:"
                            + e.field);// 取得用户名
                    };
                }
            });
        </script>
        <h1>Hello World!</h1>
    </body>
</html>
